<script setup>
import {ref, defineProps} from "vue";


const props = defineProps(['practice', 'radioOptions', 'checkboxOptions', 'judgeOptions'])
// 单选选项被点击
const handleRadioChange = (options, index) => {
  for (const option of options) {
    option.checked = 0;
  }
  options[index].checked = 1;
}

</script>

<template>
  <el-form-item label="参考答案" v-if="practice.type ==3||practice.type==4">
    <el-input
        v-model="practice.answer"
        style="width: 800px"
        :rows="8"
        type="textarea"
        placeholder="请输入参考答案内容"
    />
  </el-form-item>
  <!--单选-->
  <el-form-item label="题目选项" v-if="practice.type == 0">
    <div v-for="(option, index) in radioOptions" :key="index" style="display: flex;align-items: center;margin: 10px 0;">
      <span>{{ option.value }}</span>
      <el-input placeholder="请输入选项内容"
                style="width: 670px;height: 40px; margin-left: 20px;margin-right: 10px;"
                v-model="radioOptions[index].content"
      />
    </div>
  </el-form-item>
  <!--    多选题-->
  <el-form-item label="题目选项" v-if="practice.type == 1">
          <div v-for="(option, index) in checkboxOptions" :key="index" style="margin: 10px 0;display: flex;align-items: center;">
            <div>{{ option.value }}</div>
            <el-input placeholder="请输入选项内容"
                      style="width: 670px;height: 40px; margin-left: 20px;margin-right: 10px;"
                      v-model="checkboxOptions[index].content"
            />
          </div>
  </el-form-item>
</template>

<style scoped lang="less">

</style>